<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>详情页面</title>
    <link href="/pharmacy/css/shopdetail.css" rel="stylesheet" type="text/css">
    <script src="/pharmacy/plugins/jquery/jquery-3.4.1.js"></script>
</head>
<body>
导航栏
<!-----商品详情部分------->
<div class="shopdetails">
    <div id="leftbox">
        <div id="showbox">
            <img src="/pharmacy/${goodDetail.goodImages}" width="400" height="400" />
        </div>
    </div>
    <!----中间----->
    <div class="centerbox">
        <p class="imgname">${goodDetail.goodName}</p>
        <p class="price">价格：<samp>${goodDetail.goodPrice}</samp></p>
        <p class="kefu">客服：</p>
        <div class="clear"></div>
        <div style="margin-top: 50px">
            请输入想要购买的数量：
            <input type="text"style="width: 40px" id="num" value="1">
        </div>
        <p class="buy"><a href="javascript:;" style="background-color: red ;color: white" onclick="buy(${goodDetail.id})">立即购买</a>
            <a href="javascript:;"  id="cart" onclick="cart(${goodDetail.id})" type="button">加入购物车</a>
            <button type="button" style="width: 40px;height: 20px " id="collect" value="收藏" onclick="collection(${goodDetail.id})">收藏</button></p>
<%--            <img src="<%=request.getContextPath()%>/images/收藏-产品详情.png" alt="图片加载失败" style="height: 100%;margin-top: 10px;margin-left: 10px;background-color: red "></p>--%>
        <div class="clear"></div>
        <div class="fenx"><a href="#"><img src="/pharmacy/images/tell07.png"></a></div>
        <p class="fuwu">服务承诺：</p>
        <p class="pay">支付方式：</p>
    </div>
</div>
顶部导航栏
<script type="text/javascript">
    function buy(goodId){
        var num=$('#num').val();
        // $.post("user",function(data){
        //     if(data > 0){
                window.location.href="/pharmacy/order/detail?goodId="+goodId+"&number="+num
            // }else if(data==-1){
            //     alert("请先登录");
            //     setTimeout(function(){//两秒后跳转
            //         location.href="/pharmacy/index/login";
            //     },2000);
            // }
        // })

    }

    $.getJSON("/pharmacy/good/collect",function (data) {
        if(data!=null)
            for(var i=0;i<data.length;i++)
                if(data[i]==${goodDetail.id}){
                        $("#collect").val("已收藏");
                    $("#collect").css("background-color","yellow")
    }
    })

    function collection(goodId) {
        if($('#collect').val()=="收藏"){
            $.post("addCollect", {goodId:goodId}, function(data){
                if(data > 0){
                    alert("加入收藏成功")
                    $("#collect").val("已收藏");
                    $("#collect").css("background-color","yellow")
                }else if(data==-1){
                    alert("请先登录");
                    setTimeout(function(){//两秒后跳转
                        location.href="/pharmacy/index/login";
                    },2000);
                }
            })
        }else{
            $.post("deleteCollect", {goodId:goodId}, function(data){
                if(data > 0){
                    alert("删除收藏成功")
                    $("#collect").val("收藏");
                    $("#collect").css("background-color","white")
                }else if(data==-1){
                    alert("请先登录");
                    setTimeout(function(){//两秒后跳转
                        location.href="/pharmacy/index/login";
                    },2000);
                }
            })
        }
    }

    function cart(goodId) {
        var num=$('#num').val();
        $.post("cart", {goodId:goodId, goodNum:num}, function(data){
            if(data > 0){
                alert("加入购物车成功")
            }else if(data==-1){
                alert("请先登录");
                setTimeout(function(){//两秒后跳转
                    location.href="/pharmacy/index/login";
                },2000);
            }
        })
    }
</script>
</body>
</html>
